<template>
	<view class="container">
		<view class="fiexd-top">
			<view class="header">
				<view class="arrow" @tap="$back()"><image src="../../static/images/arrow_left.png" mode="aspectFit"></image></view>
				<view class="text f36 cfff">存盘单</view>
				<view>
					<view class="save f36 cfff" @tap="Jump()" v-if="inventoryInfo.is_complete == 0" >{{inventoryInfo.is_complete == 0 ? '结束盘点' : ''}}</view>
					<view class="save f36 cfff" @tap="adjust()" v-if="inventoryInfo.is_adjust == 1">{{inventoryInfo.is_adjust == 1 ? '查看调整单' : ''}}</view>
				</view>
			</view>
		</view>
		<view style="height: 130upx;"></view>

		<view class="gatherBox">
			<view class="top f32 cfff pb70">
				<view class="time">{{ inventoryInfo.create_time | birtime}} 盘点汇总</view>
				<view class="process">{{ inventoryInfo.is_complete == 0 ? '进行中' : '结束' }}</view>
			</view>

			<view class="bottom">
				<view class="left">
					<view class="goodsNumber f36 cfff">货品数：{{ inventoryInfo.goods_num }}</view>
					<view class="checkNumber f36 cfff">盘点数：{{ inventoryInfo.operate_num }}</view>
				</view>
				<view class="right"><view class="text f32 cfff" @tap="Jump()">点击查看差异数</view></view>
			</view>
		</view>

		<view class="personBox mb20">
			<view class="pic"><image src="../../static/images/icon_people.png" mode=""></image></view>
			<view class="name f30 c333">共{{ inventorylist.length }}人参与盘点（发起人：{{ inventoryInfo.user_name }}）</view>
		</view>

		<view class="sheetList">
			<view class="sheet-item mb20" v-for="(item, i) in inventorylist" :key="i" @tap="goRecord(item.inventory_id, item.user_id)">
				<view class="left">
					<view class="pic"><dimg :src="item.avatar"></dimg></view>
					<view class="name f32 c333">
						{{ item.user_name }}
						<block v-if="item.is_boss == 1 ? '（老板）' : ''"></block>
					</view>
				</view>
				<view class="right">
					<view class="text f28 c666">货品数{{ item.goods_num }}/盘点数{{ item.operate_num }}</view>
					<view class="arrow"><image src="../../static/images/arrow_right.png" mode=""></image></view>
				</view>
			</view>
		</view>

		<view style="height: 130upx;"></view>
		<view class="fiexd-add" @click="GOproceedInventory"><view class="text f32 cfff">继续盘点</view></view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			id: '', //盘点单id
			inventoryInfo: {},
			inventorylist: []
		};
	},
	onShow() {
		this.id = uni.getStorageSync('id');
		console.log(this.id);
		this.getInfo();
	},
	onLoad() {},
	methods: {
		//盘点单详情

		getInfo() {
			let that = this;
			that.$ajax('api/v1.inventory/info', {
				inventory_id: that.id
			})
				.then(res => {
					if (res.code == 1) {
						that.inventoryInfo = res.result.info;
						that.inventorylist = res.result.list;
					}
				})
				.catch(res => {
					that.$sToast(res.message);
				});
		},
		goRecord(id, userid) {
			uni.navigateTo({
				url: './inventoryrecord?id=' + id + '&userid=' + userid
			});
		},
		Jump() {
			uni.navigateTo({
				url: './difference?id=' + this.inventoryInfo.inventory_id + '&userid=' + this.inventoryInfo.user_id
			});
		},
		adjust(){
			uni.navigateTo({
				url:'./adjustment?id='+this.inventoryInfo.operate_id
			})
		},
		GOproceedInventory() {
			uni.navigateTo({
				url: 'proceedInventory'
			});
			uni.setStorage({
				key: 'state',
				data: -1
			});
		}
	}
};
</script>

<style lang="scss">
page {
	background-color: #f7f4f8;
}

.status_bar {
	height: var(--status-bar-height);
	width: 100%;
	background-color: #ffffff;
}

.top_view {
	height: var(--status-bar-height);
	width: 100%;
	position: fixed;
	background-color: #fff;
	top: 0;
	z-index: 999;
}

.fiexd-top {
	width: 100%;
	position: fixed;
	z-index: 99999;
}

.header {
	flex: 1;
	display: flex;
	flex-direction: row;
	box-sizing: border-box;
	justify-content: space-between;
	align-items: center;
	background-color: #249af6;
	padding: 55upx 30upx 25upx 30upx;
	text-align: center;
	
    .text{
		display: flex;
		flex-direction: row;
		justify-content: center;
	}
	.arrow {
		image {
			width: 22upx;
			height: 40upx;
		}
	}
}
.gatherBox {
	background-color: #249af6;
	padding: 35upx 30upx;
	margin: 20upx 30upx;
	box-sizing: border-box;
	.top {
		display: flex;
		flex-direction: row;
		justify-items: center;
		justify-content: space-between;
	}
	.bottom {
		display: flex;
		flex-direction: row;
		justify-items: center;
		justify-content: space-between;
		.goodsNumber {
			margin-bottom: 30upx;
		}
		.right {
			margin-top: 30upx;
			.text {
				border: 2upx #fff solid;
				border-radius: 5upx;
				padding: 10upx 15upx;
				display: inline-block;
			}
		}
	}
}
.personBox {
	display: flex;
	flex-direction: row;
	align-items: center;
	background-color: $white-background;
	padding: 40upx 30upx;
	.pic {
		image {
			width: 50upx;
			height: 45upx;
			margin-right: 30upx;
			vertical-align: middle;
		}
	}
}
.sheetList {
	.sheet-item {
		padding: 40upx 30upx;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		background-color: $white-background;
		.left {
			display: flex;
			flex-direction: row;
			align-items: center;
			.pic {
				image {
					width: 100upx;
					height: 100upx;
					border-radius: 50%;
					margin-right: 30upx;
				}
			}
		}
		.right {
			display: flex;
			flex-direction: row;
			align-items: center;
			.arrow {
				margin-left: 20upx;
				image {
					width: 20upx;
					height: 35upx;
				}
			}
		}
	}
}
.fiexd-add {
	width: 100%;
	position: fixed;
	bottom: 0;
	height: 100upx;
	line-height: 100upx;
	background-color: #249af6;

	.text {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
	}
}
</style>
